嵌入对象标签 object 与 embed

<object> 和 <embed> 用于嵌入外部资源，如 PDF、Flash、Java Applet 等插件内容。

object 标签

基本语法

HTML

<object data="resource.pdf" type="application/pdf" width="800" height="600">
  <param name="view" value="FitH">
  <param name="toolbar" value="1">
  <!-- 回退内容 -->
  <p>无法显示PDF，请<a href="resource.pdf">下载查看</a></p>
</object>

核心属性

属性	说明
data	资源URL
type	MIME类型
width/height	尺寸
name	对象名称
form	关联表单

param 子元素

HTML

<object data="video.swf" type="application/x-shockwave-flash">
  <param name="movie" value="video.swf">
  <param name="quality" value="high">
  <param name="autoplay" value="true">
</object>

embed 标签

基本语法

HTML

<embed
  src="resource.pdf"
  type="application/pdf"
  width="800"
  height="600"
>

核心属性

属性	说明
src	资源URL
type	MIME类型
width/height	尺寸
pluginspage	插件下载页

两者区别

特性	object	embed
标准	HTML4/HTML5	HTML5
回退内容	支持	不支持
param配置	支持	属性配置
浏览器支持	更好	历史兼容
推荐使用	✓	尽量避免

常见用例

嵌入PDF

HTML

<object data="document.pdf" type="application/pdf" width="100%" height="600px">
  <p>您的浏览器不支持PDF预览，请<a href="document.pdf">下载文件</a></p>
</object>

<!-- 或使用 iframe（推荐） -->
<iframe src="document.pdf" width="100%" height="600px"></iframe>

嵌入SVG

HTML

<object data="diagram.svg" type="image/svg+xml" width="400" height="300">
  <img src="diagram.png" alt="图表">
</object>

嵌入网页（旧方式）

HTML

<object data="https://example.com" type="text/html" width="800" height="600">
  <p>无法加载内容</p>
</object>

<!-- 推荐：使用 iframe -->
<iframe src="https://example.com" width="800" height="600"></iframe>

现代替代方案

替代对照表

旧方式	现代替代
`<object data=".pdf">`	`<iframe src=".pdf">` 或 PDF.js
`<embed src=".swf">`	HTML5 `<video>` / `<canvas>`
`<object data=".svg">`	`<img src=".svg">` 或内联 SVG
`<embed>` 插件	Web API / WebAssembly

PDF 嵌入现代方案

HTML

<!-- 方案1：iframe（简单） -->
<iframe src="document.pdf" width="100%" height="600px"></iframe>

<!-- 方案2：Google Docs Viewer -->
<iframe
  src="https://docs.google.com/viewer?url=https://example.com/doc.pdf&embedded=true"
  width="100%"
  height="600px"
></iframe>

<!-- 方案3：PDF.js（可控性强） -->
<div id="pdf-container"></div>
<script src="pdf.js"></script>

注意：Flash 已于 2020 年底停止支持，应使用 HTML5 原生标签替代。

安全注意事项

HTML

<!-- 避免嵌入不可信来源 -->
<object data="untrusted-source.com/content">  <!-- 危险 -->
</object>

<!-- 使用 sandbox 限制权限 -->
<iframe sandbox="allow-scripts" src="content.html"></iframe>

要点总结

object 支持回退内容，embed 不支持
现代 Web 应优先使用 iframe、video、canvas 等标准标签
Flash 已废弃，使用 HTML5 原生能力替代
嵌入外部资源需注意安全风险
PDF 嵌入推荐使用 iframe 或 PDF.js